<template>
<div class="mainContent">
  <pathTracking :path="Model.path" />
  <div class="addcont">
    <div class="add">
      <img class="plus" src="@/assets/img/button_plus.png" alt>
      <p class="font" @click="onTableCreate(false)">新建</p>
    </div>
  </div>
  <div class="container">
    <div class="bgWhite bgRadius">
      <card :configArr="Model.configArr"></card>
      <el-row>
        <div class="common-table-title">
          <div class="common-table-icon"></div>
          <div class="common-table-fl">查询条件</div>
        </div>
      </el-row>
      <!-- 高级搜索 -->
      <advancedSearch :option="Model.filterOption" @getChild="getFilterData" @onSearch="onFilterSearch" @onClear="onFilterClear" @onExport="onFilterExport"></advancedSearch>
    </div>
    <!-- 表格 -->
    <div class="table">
      <el-row>
        <div class="common-table-title">
          <div class="common-table-icon"></div>
          <div class="common-table-fl">
            <span>采购入库列表</span>
          </div>
          <div class="common-btn-group">
            <div class="common-table-btn-item" @click="onTableExport">导出</div>
          </div>
        </div>
      </el-row>
      <el-table :data="Model.tableData" border style="width: 100%;"  @selection-change="onTableSelectionChange">
        <el-table-column type="selection" width="50" fixed></el-table-column>
        <el-table-column fixed="index" label="序号" width="50"></el-table-column>
        <el-table-column prop="number" label="采购入库单号" width="200">
          <template slot-scope="scope">
            <el-button type="text" @click="toTableDetail(scope.row,true)">{{scope.row.number}}</el-button>
          </template>
        </el-table-column>
        <el-table-column prop="originNumber" label="到货通知单" width="200"></el-table-column>
        <el-table-column prop="statusDict.value" label="入库单状态" width="120"></el-table-column>
        <el-table-column prop="location" label="入库仓库" width="200"></el-table-column>
        <el-table-column prop="typeDict.value" label="入库单类型" width="120"></el-table-column>
        <el-table-column prop="supplierName" label="供应商" width="120"></el-table-column>
        <!-- <el-table-column prop="shouldGoodsQuantity" label="应入总数量" width="120"></el-table-column>
          <el-table-column prop="actualGoodsQuantity" label="实入总数量" width="120"></el-table-column>-->
        <el-table-column prop="createUser" label="创建人" width="120"></el-table-column>
        <el-table-column prop="createTime" label="创建时间" width="200"></el-table-column>
        <el-table-column prop="updateUser.updateBy" label="操作人" width="120"></el-table-column>
        <el-table-column prop="sureTime" label="入库时间" width="200"></el-table-column>
        <el-table-column prop="remark" label="备注" width="120"></el-table-column>
        <el-table-column fixed="right" label="操作" width="210">
          <template slot-scope="scope">
            <div class="btnGroup" v-if="scope.row.status == 10">
              <div class="operate-btn" @click="onWarehousing(scope.row)">入库</div>
              <div class="operate-btn" @click="onVoid(scope.row.id,false)">作废</div>
              <div class="operate-btn" @click="onTableCreate(scope.row.number)">编辑</div>
              <!-- 这里传参变编辑 -->
            </div>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <!-- 分页 -->
    <el-row class="pagination-cont">
      <el-pagination @size-change="onTableSizeChange" background @current-change="onTableCurrentChange" :current-page="Model.pager.params.pageIndex" :pager-count="5" :page-sizes="Model.pager.pageSizeArr" :page-size="Model.pager.params.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="Model.pager.pageTotal"></el-pagination>
    </el-row>
  </div>
</div>
</template>

<script>
import pathTracking from "@/components/common/pathTracking";
import pagination from "@/components/common/pagination.vue";
import card from "@/components/common/filterBtns";
import advancedSearch from "@/components/common/filter/advancedSearch";

import Model from "./model.js";
import Controller from "./controller.js";
export default {
  name: "purchase",
  mixins: [Model, Controller],
  components: {
    advancedSearch,
    pagination,
    pathTracking,
    card
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->

<style lang="less" scoped>
@import "./index.less";
</style>
